<template>
    <div :style="execGlobalStyle">
        <el-pagination
            v-model:current-page="currentPageData"
            v-model:page-size="pageSizeData"
            :small="this.propJson.paginationSizeType === 'small'"
            :background="this.propJson.isBackground"
            :layout="layout"
            :total="total"
            @change="changePage"
            :page-sizes="pageSizeList"
            :style="execClass"
            :info="currentPage"
            :info2="pageSize"
        />
    </div>
</template>

<script>
import {deepCopy} from "@/utils/tagCreate";
import {doThirdServiceAction} from "@/request/lowcode/thirdService";

export default {
    name: "PaginationComponent",
    props: ['propJson', 'commonParam'],
    data() {
        return {
            currentPageData: "",
            pageSizeData: ""
        }
    },
    methods: {
        async changePage(index, size) {
            // 构建内置变量参数
            let innerParams = this.propJson.pageChangeInnerRequestVariable
            let resList = deepCopy(this.propJson.paginationActionList)
            for (let i = 0; i < resList.length; i++) {
                let action = resList[i]
                if (!action.apiParamList) {
                    action.apiParamList = []
                }
                let pageIndexVariableInfo = {variableName: innerParams[0].variableName, variableValue: index, type: "custom", variableType: "String", variableParamName: ""}
                action.apiParamList.push(pageIndexVariableInfo)
                let pageSizeVariableInfo = {variableName: innerParams[1].variableName, variableValue: size, type: "custom", variableType: "String", variableParamName: ""}
                action.apiParamList.push(pageSizeVariableInfo)
            }
            // 定义一个标志位，后续同步执行
            let awaitObj = {flag: false, res: true}
            await doThirdServiceAction(resList, awaitObj, this.commonParam, ()=>{}, ()=>{}, null);
        }
    },
    computed: {
        execClass() {
            let resStyle = ""
            if (this.propJson.editFlag) {
                resStyle += "pointer-events: none;";
            }
            return resStyle;
        },
        execGlobalStyle() {
            let resStyle = "width: 100%;display: flex; align-items: center;";
            resStyle += "justify-content: " + this.propJson.layOutPosition + ";";
            return resStyle;
        },
        currentPage() {
            // 判断是否为自定义
            if (this.propJson.currentPageType === 'custom') {
                this.currentPageData = parseInt(this.propJson.currentPageCustom)
            } else if (this.propJson.currentPageType === 'variable') {
                for (let i = 0; i < this.commonParam.length; i++) {
                    let commonParamInfo = this.commonParam[i]
                    if (this.propJson.currentPageVariable === commonParamInfo.variableName) {
                        if (commonParamInfo.variableValue === "") {
                            this.currentPageData = 1
                            break;
                        }
                        this.currentPageData = parseInt(commonParamInfo.variableValue)
                        break;
                    }
                }
            } else {
                this.currentPageData = 1
            }
        },
        pageSize() {
            // 判断是否为自定义
            if (this.propJson.pageSizeType === 'custom') {
                this.pageSizeData = parseInt(this.propJson.pageSizeCustom)
            } else if (this.propJson.pageSizeType === 'variable') {
                for (let i = 0; i < this.commonParam.length; i++) {
                    let commonParamInfo = this.commonParam[i]
                    if (this.propJson.pageSizeVariable === commonParamInfo.variableName) {
                        if (commonParamInfo.variableValue === "") {
                            this.pageSizeData = 10
                            break;
                        }
                        this.pageSizeData = parseInt(commonParamInfo.variableValue)
                        break;
                    }
                }
            } else {
                this.pageSizeData = 10
            }
        },
        total() {
            // 判断是否为自定义
            if (this.propJson.totalType === 'custom') {
                return parseInt(this.propJson.totalCustom)
            } else if (this.propJson.totalType === 'variable') {
                for (let i = 0; i < this.commonParam.length; i++) {
                    let commonParamInfo = this.commonParam[i]
                    if (this.propJson.totalVariable === commonParamInfo.variableName) {
                        if (commonParamInfo.variableValue === "") {
                            return 10
                        }
                        return parseInt(commonParamInfo.variableValue)
                    }
                }
            } else {
                return 10
            }
        },
        layout() {
            let layOutRes = []
            if (this.propJson.paginationLayoutPrevFlag) {
                let index = this.propJson.paginationLayoutPrevNum - 1;
                // 插入数据
                layOutRes.splice(index, 0, "prev")
            }
            if (this.propJson.paginationLayoutPagerFlag) {
                let index = this.propJson.paginationLayoutPagerNum - 1;
                // 插入数据
                layOutRes.splice(index, 0, "pager")
            }
            if (this.propJson.paginationLayoutNextFlag) {
                let index = this.propJson.paginationLayoutNextNum - 1;
                // 插入数据
                layOutRes.splice(index, 0, "next")
            }
            if (this.propJson.paginationLayoutJumperFlag) {
                let index = this.propJson.paginationLayoutJumperNum - 1;
                // 插入数据
                layOutRes.splice(index, 0, "jumper")
            }
            if (this.propJson.paginationLayoutSizesFlag) {
                let index = this.propJson.paginationLayoutSizesNum - 1;
                // 插入数据
                layOutRes.splice(index, 0, "sizes")
            }
            if (this.propJson.paginationLayoutTotalFlag) {
                let index = this.propJson.paginationLayoutTotalNum - 1;
                // 插入数据
                layOutRes.splice(index, 0, "total")
            }
            let resStr = ""
            for (let i = 0; i < layOutRes.length - 1; i++) {
                let info = layOutRes[i]
                resStr += info + ", "
            }
            if (layOutRes.length > 0) {
                resStr += layOutRes[layOutRes.length - 1]
            }
            return resStr
        },
        pageSizeList() {
            // 判断是否为空
            if (this.propJson.pageSizeList === "") {
                return [10]
            }
            if (Array.isArray(this.propJson.pageSizeList)) {
                return this.propJson.pageSizeList
            } else {
                return JSON.parse(this.propJson.pageSizeList)
            }
        }
    },
    mounted() {

    }
}
</script>

<style scoped lang="less">

</style>